<template>
    <div class="SubList" ref="SubPage" v-loading="load" element-loading-text="拼命加载中">
        <mytag></mytag>
        <div class="SubPage_box">
            <lvehomebtns
                ref="subbox_top"
                :ClickselectList="ClickselectList"
                :GetHeaderFun="GetHeaderFun"
                :tablebody="tablebody"
            ></lvehomebtns>
            <el-table
                :data="tableData"
                fit
                border
                height="80%"
                style="width: 100%"
                tooltip-effect="dark"
                size="small"
                :highlight-current-row="true"
                @select="Clickselect"
                @row-dblclick="RwoDbclick"
            >
                <el-table-column type="selection" width="55"></el-table-column>

                <el-table-column
                    v-for="(item, index) in tableHeader"
                    :key="index"
                    :prop="item.fieldName"
                    :label="item.title"
                    align="center"
                    width="150px"
                ></el-table-column>
            </el-table>
            <div class="block">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="Page.pagecurrent"
                    :page-sizes="[10, 50, 100, 500]"
                    :page-size="Page.pagesize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="Page.total"
                ></el-pagination>
            </div>
        </div>
    </div>
</template>
<script>
import { SubPageList, GetModuleTreeData } from '@/api/index';
import lvehomebtns from './LevHomeBtns';
import mytag from '@/components/common/MyTag';
export default {
    props: ['loading'],
    name: 'SubList',
    data() {
        return {
            //数据
            tableData: [],
            //等待
            load: null,
            //分页
            Page: {
                pagecurrent: 1,
                pagesize: 10,
                total: 100
            },
            //表头
            tableHeader: [],
            tablebody: [],
            //获取列表多选框选中的值
            ClickselectList: [],
            Sendobj: {}
        };
    },
    mounted() {
        let allList = JSON.parse(sessionStorage.getItem('tableHeaddataparam'));
        this.GetHeaderFun(allList.tabId);
    },
    methods: {
        Clickselect(row) {
            this.ClickselectList = row;
        },
        //双击行进入修改页
        RwoDbclick(row) {
            this.$router.push({ path: '/AddUp', query: { obj: row, name: 'Upd' } });
        },
        //获取表头的标识
        GetHeaderFun(params) {
            this.load = this.loading;
            GetModuleTreeData(params).then(({ data }) => {
                this.tableHeader = data.data;
                console.log(this.tableHeader);
                this.load = false;
                let num = this.tableHeader.length;
                let TheadeHeader = [];
                let TbodyHeader = [];

                this.tableHeader.forEach((v, i) => {
                    if (v.isEntity == false) {
                        TheadeHeader.push(v);
                        sessionStorage.setItem('tableHeaddataparam', JSON.stringify(TheadeHeader[0]));
                    } else {
                        TbodyHeader.push(v);
                        sessionStorage.setItem('tableHeaddataparam', JSON.stringify(TbodyHeader[0]));
                    }
                });
                if (num == TheadeHeader.length) {
                    this.Sendobj.existEntity = TheadeHeader[0].isEntity;
                    this.Sendobj.headName = TheadeHeader[0].originTable;
                    this.Sendobj.oneEntityName = '';
                } else {
                    this.Sendobj.existEntity = TbodyHeader[0].isEntity;
                    this.Sendobj.headName = TheadeHeader[0].originTable;
                    this.Sendobj.oneEntityName = TbodyHeader[0].originTable;
                }
                this.GetDataFun(this.Sendobj);
                this.tablebody = TbodyHeader;
            });
        },

        handleSizeChange(val) {
            this.Page.pagesize = val;
            this.GetDataFun(this.Sendobj);
        },
        handleCurrentChange(val) {
            this.Page.pagecurrent = val;
            this.GetDataFun(this.Sendobj);
        },
        //获取列表的数据
        GetDataFun(param) {
            let tableId = sessionStorage.getItem('tableId');
            let TheadeData = [];
            let entryhead = [];
            let entrybody = [];
            let TbodyData = [];
            SubPageList({
                existEntity: param.existEntity,
                headName: param.headName,
                oneEntityName: param.oneEntityName,
                pageNum: this.Page.pagecurrent,
                pageSize: this.Page.pagesize,
                tableId: tableId
            }).then(({ data }) => {
                data.data.list.forEach((v, i) => {
                    if (v.entity == null) {
                        for (const key in v[param.headName]) {
                            for (const kes in v) {
                                if (key == kes) {
                                    v[param.headName][key] = v[kes].name;
                                }
                            }
                        }
                        TheadeData.push(v[param.headName]);
                    } else {
                        for (const key in v.head) {
                            for (const kes in v.head[param.headName]) {
                                if (key == kes) {
                                    v.head[param.headName][kes] = v.head[key].name;
                                }
                            }
                        }
                        entryhead.push(v.head[param.headName]);
                        for (const key in v.entity) {
                            for (const kes in v.entity[param.oneEntityName]) {
                                if (key == kes) {
                                    v.entity[param.oneEntityName][kes] = v.entity[key].name;
                                }
                            }
                        }
                        entrybody.push(v.entity[param.oneEntityName]);
                    }
                });
                entryhead.forEach((v, i) => {
                    let obj = {};

                    for (const key in v) {
                        obj.ids = v.id;
                        obj[key] = v[key];
                        for (const kes in entrybody[i]) {
                            obj[kes] = entrybody[i][kes];
                        }
                    }
                    TbodyData.push(obj);
                });
                data.data.list.forEach((v, i) => {
                    if (v.entity == null) {
                        this.tableData = TheadeData;
                    } else {
                        this.tableData = TbodyData;
                    }
                });
                this.Page.total = data.data.total;
            });
        }
    },
    components: {
        lvehomebtns,
        mytag
    }
};
</script>
<style lang="less" scoped>
.SubList {
    width: 100%;
    height: 100%;

    .SubPage_box {
        width: 100%;
        height: 90%;
        background: #fff;
        padding: 15px 45px;
        box-sizing: border-box;
    }
    .block {
        display: flex;
        justify-content: flex-end;
    }
}
</style>